<template>
  <el-form ref="editFormRef" :model="form" v-loading="loading">
    <pub-edit-description :labelWidth="165" :ndColumns="2">
      <pub-edit-description-item :span="1" label="角色名称" required>
        <el-form-item prop="name" :rules="$formRules.input">
          <pub-input v-model="form.name" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="机构类型" required>
        <el-form-item prop="orgType" :rules="$formRules.select">
          <pub-select-dict
            width="100%"
            v-model="form.orgType"
            type="Number"
            dict-code="JGLX-1"
            placeholder="请选择"
          />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="绑定角色" required>
        <el-form-item prop="roleIds" :rules="$formRules.select">
          <org-select-multiple
            apiUrl="/role/list"
            valueType="String"
            :maxCollapseTags="4"
            :searchForm="{ pageNum: 1, pageSize: 6000 }"
            v-model:modelValue="form.roleIds"
          />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="所属区域" required>
        <el-form-item prop="level" :rules="$formRules.select">
          <pub-select-dict
            width="100%"
            v-model="form.level"
            type="Number"
            dict-code="SSQY"
            placeholder="请选择"
          />
        </el-form-item>
      </pub-edit-description-item>
    </pub-edit-description>
  </el-form>

  <div class="dialog-footer-btn">
    <el-button type="default" @click="close()">取消</el-button>
    <el-button
      v-hasPermissions="['basic:system:roles:save']"
      type="primary"
      v-prevent-repeat-click
      @click="submitForm(editFormRef)"
    >
      保存
    </el-button>
  </div>
</template>

<script setup>
const emit = defineEmits(['close', 'submitForm'])
const props = defineProps({
  editData: {
    type: Object,
    default() {
      return {}
    }
  },
  isEdit: Boolean
})
const editFormRef = ref()
const loading = ref(false)
const form = ref({
})


onMounted(() => {
  if (props.isEdit) {
    form.value = JSON.parse(JSON.stringify(props.editData))
    // form.enterIndex = form.enterIndex + ''
    console.log(props.editData)
  }
})


const close = () => {
  emit('close')
}

const submitForm = editFormRef => {
  editFormRef.validate(valid => {
    if (valid) {
      loading.value = true
      emit('submitForm', form.value)
    }
  })
}
</script>

<style scoped>
.align-center {
  align-items: center;
}
/* 弹窗提交时loading样式需占满整个弹窗 */
.el-loading-parent--relative {
  position: inherit !important;
}
</style>
